.jaanim {
  position: absolute;
  top: -999em;
  left: -999em;
  z-index: 9999;
}

.tipwrap{
  position: relative;
}

.jaatip {
  position: absolute;
  -webkit-transition: opacity 0.5s ease-out;
     -moz-transition: opacity 0.5s ease-out;
      -ms-transition: opacity 0.5s ease-out;
       -o-transition: opacity 0.5s ease-out;
          transition: opacity 0.5s ease-out;
  opacity: 0;
  left:135px;
  bottom:-10px;
  min-width: 200px;
}

.jaanim.zoomlv1 {
  -webkit-transform: scale(0.8);
     -moz-transform: scale(0.8);
      -ms-transform: scale(0.8);
       -o-transform: scale(0.8);
          transform: scale(0.8);
  z-index: 9998;
}

.jaanim.zoomlv2 {
  -webkit-transform: scale(0.6);
     -moz-transform: scale(0.6);
      -ms-transform: scale(0.6);
       -o-transform: scale(0.6);
          transform: scale(0.6);
    z-index: 9997;
}

.jaanim.zoomlv3 {
  -webkit-transform: scale(0.4);
     -moz-transform: scale(0.4);
      -ms-transform: scale(0.4);
       -o-transform: scale(0.4);
          transform: scale(0.4);
    z-index: 9996;
}
.jaanim.zoomlv3 .jaatip{
  -webkit-transform: scale(2);
     -moz-transform: scale(2);
      -ms-transform: scale(2);
       -o-transform: scale(2);
          transform: scale(2);
}

.jaatip {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.8);
    border-radius: 8px 8px 8px 8px;
    color: #DDDDDD;
    opacity: 0.5;
    padding: 10px 15px;
}
.jaatip:before {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
    border-radius: 10px 10px 10px 10px;
    bottom: -6px;
    content: "";
    height: 8px;
    left: -8px;
    position: absolute;
    text-indent: -9999px;
    width: 8px;
}
.jaatip:after {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4);
    border-radius: 10px 10px 10px 10px;
    bottom: -9px;
    content: "";
    height: 6px;
    left: -16px;
    position: absolute;
    text-indent: -9999px;
    width: 6px;
}

.jaatip.hflip {
  left:auto;
  right:200px;
}

.jaatip.hflip:before {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
    border-radius: 10px 10px 10px 10px;
    bottom: -6px;
    content: "";
    height: 8px;
    right: -8px;
    left: auto;
    position: absolute;
    text-indent: -9999px;
    width: 8px;
}

.jaatip.hflip:after {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4);
  border-radius: 10px 10px 10px 10px;
  bottom: -9px;
  content: "";
  height: 6px;
  right: -16px;
  left: auto;
  position: absolute;
  text-indent: -9999px;
  width: 6px;
}

